<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.6.0.js"></script>
</head>
<body>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="page-header">
                <h1>公共管理</h1>
            </div>
        </div>
    </div>

    <div class="row clearfix">
        <div class="col-md-5 column">
            <form action="${pageContext.request.contextPath}/admin/addNotice" method="post">
                <div class="form-group">
                    <label for="msg" class="control-label">Message:</label>
                    <%--<input type="text" class="form-control" id="reply" name="reply" >--%>
                    <textarea name="msg" id="msg"></textarea>
                </div>
                <button type="submit" class="btn btn-default">添加公告</button>
            </form>
        </div>
    </div>

    <div class="row clearfix">
        <div class="col-md-12 column">
            <table class="table table-hover table-striped">
                <thead>
                <tr>
                    <th>编号</th>
                    <th>内容</th>
                    <th>创建时间</th>
                    <th>操作</th>
                </tr>
                </thead>
                <%--书籍从数据库中查询出来，从list中便利出来 ：foreach--%>
                <tbody>
                <c:forEach var="notice" items="${PageInfo.list}" >
                    <tr>
                        <td><a href="#">${notice.mid}</a></td>
                        <td>${notice.msg}</td>
                        <td>${notice.createTime}</td>
                        <td>
                                <%--<input type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal" data-oid="${comment.oid}" data-reply="${comment.reply}" value="回复">--%>
                            <a class="btn btn-primary" data-toggle="modal" data-target="#update" data-mid="${notice.mid}" data-notice="${notice.msg}">修改</a>
                           | <a class="btn btn-primary" href="${pageContext.request.contextPath}/admin/deleteNotice">删除</a>
                        </td>
                    </tr>
                </c:forEach>
                </tbody>
            </table>
            <div style="float: right">
                <ul class="pagination pagination-right">
                    <li><a href="${pageContext.request.contextPath}/admin/allNotice?page=1&size=${PageInfo.pageSize}" >首页</a></li>
                    <li><a href="${pageContext.request.contextPath}/admin/allNotice=${PageInfo.pageNum-1}&size=${PageInfo.pageSize}">上一页</a></li>
                    <c:forEach begin="${PageInfo.pageNum}" end="${PageInfo.pageNum+2}" var="pageNum">
                        <li><a href="${pageContext.request.contextPath}/admin/allNotice?page=${pageNum}&size=${PageInfo.pageSize}" >${pageNum}</a></li>
                    </c:forEach>
                    <li><a href="${pageContext.request.contextPath}/admin/allNotice?page=${PageInfo.pageNum+1}&size=${PageInfo.pageSize}" >下一页</a></li>
                    <li><a href="${pageContext.request.contextPath}/admin/allNotice?page=${PageInfo.pages}&size=${PageInfoPageInfo.pageSize}">尾页</a></li>
                </ul>
            </div>

            <div class="modal fade" id="update" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title" id="exampleModalLabel">修改回复</h4>
                        </div>
                        <div class="modal-body">
                            <form action="${pageContext.request.contextPath}/admin/updateNotice" method="post">
                                <div class="form-group">
                                    <input type="hidden" class="form-control" id="mid" name="mid" >
                                    <%--<textarea name="oid" id="orderid"></textarea>--%>
                                </div>
                                <div class="form-group">
                                    <label for="notice" class="control-label">Message:</label>
                                    <%--<input type="text" class="form-control" id="reply" name="reply" >--%>
                                    <textarea name="notice" id="notice"></textarea>
                                </div>
                                <button type="submit" class="btn btn-default">修改</button>
                                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>

                            </form>
                        </div>
                        <div class="modal-footer"></div>
                    </div>
                </div>
            </div>


        </div>
    </div>


</div>

<!-- Bootstrap的所有插件都依赖于jQuery，必须在引入bootstrap.min.js前引入jQuery -->
<script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- 压缩版的bootstrap.min.js包含了所有的Bootstrap数据API插件 -->
<script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<%--<script>
    $('#myModal').on('show.bs.modal', function (event) {
        var button = $(event.relatedTarget) // Button that triggered the modal
        var oid = button.data('oid')
        var reply = button.data('reply')
        var modal = $(this)  //获得模态框本身
        modal.find('.modal-body input').val(oid)
        modal.find('.modal-body textarea').val(reply)
    })
</script>--%>

<script>
    $("#update").on('show.bs.modal', function (e) {
        let mid = $(e.relatedTarget).data("mid");
        let notice = $(e.relatedTarget).data("notice");
        console.log(mid)
        console.log(notice)
        document.getElementById("mid").value=mid;
        /*document.querySelector("#orderid").innerHTML = orderid;*/
        document.querySelector("#notice").innerHTML = notice;
        let bookId = document.getElementById("mid").innerText;
        console.log(bookId)
    });
</script>


</body>
</html>
